<template>
  <div>
    <el-button @click="saveInstorage()">提交</el-button>
    <h1 style="text-align:center">材料入库</h1>
    <el-form :inline="true" v-model="instorageData">
      <el-form-item label="所属项目">
        <el-input v-model="instorageData.projectName" readonly @focus="projectDialog=true"></el-input>
      </el-form-item>
      <el-form-item label="入库名称">
        <el-input v-model="instorageData.instorageName"></el-input>
      </el-form-item>
      <el-form-item label="供货商">
        <el-input v-model="instorageData.providerId"></el-input>
      </el-form-item>
      <el-form-item label="入库金额">
        <el-input v-model="instorageData.instorageAmount"></el-input>
      </el-form-item>
      <el-form-item label="填报人">
        <el-input v-model="instorageData.applyer" readonly></el-input>
      </el-form-item>
      <el-form-item label="采购员">
        <el-input v-model="instorageData.buyerId"></el-input>
      </el-form-item>
      <el-form-item label="交货人">
        <el-input v-model="instorageData.deliveryPerson"></el-input>
      </el-form-item>
      <el-form-item label="验收人">
        <el-input v-model="instorageData.acceptorId"></el-input>
      </el-form-item>
      <el-form-item label="入库人">
        <el-input v-model="instorageData.instorageId"></el-input>
      </el-form-item>
      <el-form-item label="备注">
        <el-input v-model="instorageData.comment" type="textarea" autosize style="width:800px"></el-input>
      </el-form-item>
    </el-form>

    <el-form>
      <el-button @click="addrow()" v-if="rownum<11">增行</el-button>
      <el-button @click="decreaserow()" v-if="rownum>1">删行</el-button>
      <el-row style="text-align:center">
        <el-col :span="3"><div class="borderDiv">材料名称</div></el-col>
        <el-col :span="3"><div class="borderDiv">规格型号</div></el-col>
        <el-col :span="3"><div class="borderDiv">单位</div></el-col>
        <el-col :span="3"><div class="borderDiv">仓库</div></el-col>
        <el-col :span="3"><div class="borderDiv">入库数量</div></el-col>
        <el-col :span="3"><div class="borderDiv">单价</div></el-col>
        <el-col :span="3"><div>税率(%)</div></el-col>
        <el-col :span="3"><div></div></el-col>
      </el-row>
      <el-row v-for="index of rownum" :key="index">
        <el-col :span="3"><div class="borderDiv"><el-input readonly @focus="materialDialog=true;selectedBatchRow=index-1" v-model="batchData[index-1].materialName">
        </el-input></div></el-col>
        <el-col :span="3"><div class="borderDiv"><el-input readonly
        @focus="materialDialog=true;selectedBatchRow=index-1" v-model="batchData[index-1].unitModel">
        </el-input></div></el-col>
        <el-col :span="3"><div class="borderDiv"><el-input readonly
        @focus="materialDialog=true;selectedBatchRow=index-1" v-model="batchData[index-1].unit">
        </el-input></div></el-col>
        <el-col :span="3"><div class="borderDiv"><el-select v-model="batchData[index-1].warehouseId">
          <el-option label="1号仓库" value="1"></el-option>
          <el-option label="2号仓库" value="2"></el-option>
          <el-option label="3号仓库" value="3"></el-option>
          <el-option label="4号仓库" value="4"></el-option>
          <el-option label="5号仓库" value="5"></el-option>
          </el-select></div></el-col>
        <el-col :span="3"><div class="borderDiv"><el-input v-model="batchData[index-1].instorageCount"></el-input></div></el-col>
        <el-col :span="3"><div class="borderDiv"><el-input v-model="batchData[index-1].notaxPrice"></el-input></div></el-col>
        <el-col :span="3"><div><el-input v-model="batchData[index-1].taxRate"></el-input></div></el-col>
      </el-row>
    </el-form>


    <el-dialog :visible.sync="projectDialog" width="80%">
      <ProjectInfoList @row="getProjectRow"></ProjectInfoList>
    </el-dialog>
    <el-dialog :visible.sync="materialDialog" width="80%">
      <MaterialList @row="getMaterialRow"></MaterialList>
    </el-dialog>
  </div>
</template>
<script>
import ProjectInfoList from "../common/projectInfo/ProjectInfoList"
import MaterialList from "../common/material/MaterialList"
import MaterialInstorageModel from "../../model/lyz/MaterialInstorageModel"
const MIM=MaterialInstorageModel.getInstance();
export default{
  components:{
    ProjectInfoList,
    MaterialList
  },
  data(){
    return{
      instorageData:{},//入库数据
      batchData:[{}],//细节数据
      projectDialog:false,//显示项目的对话框
      materialDialog:false,//材料对话框
      rownum:1,//添加材料需求的行数
      selectedBatchRow:0,//选中的批量添加行
    }
  },
  created(){
    this.instorageData.applyer=sessionStorage.getItem("realName");
  },
  methods:{
    saveInstorage(){
      MIM.saveMaterialInstorage(this.instorageData,this.batchData);
    },
    getProjectRow(row){
      this.projectDialog=false;
      this.instorageData.pId=row.id;
      this.instorageData.projectName=row.projectName;
    },
    getMaterialRow(row){
      this.batchData[this.selectedBatchRow].materialName=row.materialName;
      this.batchData[this.selectedBatchRow].mateTypeId=row.id;
      this.batchData[this.selectedBatchRow].unitModel=row.unitModel;
      this.batchData[this.selectedBatchRow].unit=row.unit;
      this.batchData[this.selectedBatchRow].price=row.price;
      this.materialDialog=false;
    },
    addrow(){//添加一行
      this.batchData.push({});
      this.rownum++;      
    },
    decreaserow(){//减少一行
      this.batchData.pop();
      this.rownum--;
    }, 
  }
}
</script>